<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">

    <title>乐码在线智慧平台 - 空白页面</title>

    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html" />
    <![endif]-->

    <link rel="shortcut icon" href="../../static/favicon.ico"
          th:href="@{/static/favicon.ico}">
    <link href="../../static/css/bootstrap.min.css?v=3.3.6"
          th:href="@{/static/css/bootstrap.min.css(v='3.3.6')}" rel="stylesheet">
    <link href="../../static/css/font-awesome.min.css?v=4.4.0"
          th:href="@{/static/css/font-awesome.min.css(v='4.4.0')}" rel="stylesheet">
    <link href="../../static/css/animate.css"
          th:href="@{/static/css/animate.css}" rel="stylesheet">
    <link href="../../static/css/style.css?v=4.1.0"
          th:href="@{/static/css/style.css(v='4.1.0')}" rel="stylesheet">

    <!--cropper.js-->
    <link href="../../static/css/plugins/cropper/cropper.min.css"
          th:href="@{../../static/css/plugins/cropper/cropper.min.css}" rel="stylesheet">

    <!--自定义css部分-->
    <style type="text/css">
        .cropdiv  {
            /*  width: 360px;
              height: 360px;*/
            overflow: hidden;
            float: left;
            background: #f2f2f5;
            text-align: center;
            color: #808080;
        }
        .cropdiv .choBtn {
            text-decoration: none;
            position: relative;
            overflow: hidden;
            text-align: center;
        }
        .cropdiv .choBtn {
            background: #fff;
            border: 1px solid #d9d9d9;
            font-size: 14px;
            line-height: 18px;
            padding: 5px 20px;
            margin: 0;
            border-radius: 3px;
            display: inline-block;
            color: #333;
        }
        .choBtn2{
            text-decoration: none;
            position: relative;
            overflow: hidden;
            cursor: pointer;
            text-align: center;
            background: #fff;
            border: 1px solid #d9d9d9;
            font-size: 14px;
            line-height: 18px;
            padding: 5px 20px;
            margin: 0;
            border-radius: 3px;
            display: inline-block;
            color: #333;
            position: absolute;
            top: 230px;
            left: 15px;
            display:none;
        }
        .cropdiv .choBtn em ,.choBtn2 em{
            line-height: 11px;
            overflow: hidden;
            margin-right: 4px;
            color: #fa7d3c;
            font-style: normal;
        }
        .cropdiv .choBtn input[type=file],.choBtn2 input[type=file] {
            width: 1000px;
            height: 1000px;
            position: absolute;
            bottom: 0;
            right: 0;
            opacity: 0;
            filter: alpha(opacity=0);
        }
    </style>




</head>

<body class="gray-bg">
<div class="row wrapper border-bottom white-bg page-heading">
   <div class="row">
       <div class="row">
           <div class="form-group">
               <label class="col-lg-2 control-label">
                   <span class="redTip">*</span>
                   缩略图</label>
               <div class="col-lg-10 imgBox"  style="height:410px" >
                   <div style="width:360px;height:360px" class="cropdiv">
                       <div id="imgCho" style="display: block;">
                           <a class="choBtn" href="javascript:void(0);" style="margin-top:140px;">
                               <em>+</em>选择图片
                               <!--开始--> <input type="file" name=""  class="uploadImg" id="uploadImg" file-model="myFile">
                           </a>
                           <p>支持JPG、PNG、GIF</p>
                       </div>
                       <img src="" id="image" style="display:none;float:left;width:188px;height:120px" >
                   </div>
                   <a class="choBtn2" href="javascript:void(0);" style="margin-top:140px;">
                       <em>+</em>重新选择
                       <input type="file" name=""  class="uploadImg" id="chooseImg" file-model="myFile">
                   </a>
                   <span class="saveImg" style="display:none">保存图片</span>
                   <span class="previewTitle">预览效果</span>
                   <div class="previewImgBox">
                       <div class="previewImg" style="width:188px;height:120px">
                           <img src=""  />
                       </div>
                   </div>
               </div>
           </div>
       </div>
   </div>

</div>
<!-- 全局js -->
<script src="../../static/js/jquery.min.js?v=2.1.4"
        th:src="@{/static/js/jquery.min.js(v='2.1.4')}"></script>
<script src="../../static/js/bootstrap.min.js?v=3.3.6"
        th:src="@{/static/js/bootstrap.min.js(v='3.3.6')}"></script>

<!--cropper.js-->
<script src="../../static/public/system/cropper/cropper.js"
        th:src="@{../../static/public/system/cropper/cropper.js}"></script>

<script>


</script>
</body>

</html>